/**
 * Created by acer on 2016/9/6.
 */
$(function() {
    $("#ido").fullpage(
        {
            /*continuousVertical: true,*/  //循环演示
            //绑定菜单
            anchors: ['page1', 'page2', 'page3', 'page4','page5','page6'],
            menu: '#menu',

            // 导航

            afterLoad: function (anchorLink, index){
                if(index==2){
                    myChart1.setOption(option1);
                }
                if(index==3){
                    myChart2.setOption(option2);
                }
            }
        });
});
var a=document.getElementById('ul0').children
var b=document.getElementsByTagName('ul')
console.log(a)
console.log(b)
for(var i=0;i< a.length;i++){
    a[i].id=i;
    a[i].onclick=function(){
        fu2(this.id)
    }
}
function fu2(s){
    for(var j=0;j< a.length;j++){
        if(s==j){
            a[j].className='class1'
        }
        else{
            a[j].className=''
        }
    }
    if(s==1){
        if(b[4].style.display=='block'){
            b[4].style.display='none'
            b[6].style.display='none'
        }
        else{
            b[4].style.display='block'
            b[6].style.display='none'
        }
    }
    else if(s==3){
        if(b[6].style.display=='block'){
            b[4].style.display='none'
            b[6].style.display='none'
        }
        else{
            b[4].style.display='none'
            b[6].style.display='block'
        }
    }else{
        b[4].style.display='none'
        b[6].style.display='none'
    }
}
var myChart1=echarts.init(document.getElementById('main1'));
var option1 = {
    xAxis:  {
        boundaryGap: false,
        data: ['2014年1月','2014年3月','2014年5月','2014年7月','2014年9月','2014年11月','2015年1月','2015年3月','2015年5月','2015年7月','2015年9月','2015年12月','2016年2月'],
        axisLine:{
            lineStyle:{
                color:'#fff'
            }
        },
        splitLine:{
            show:true,
            lineStyle:{
                color:'grey',
                type:'dashed'
            }
        }
    },
    yAxis: {
        axisLine:{
            show:false
        },
        axisTick:{
            show:false
        },
        axisLabel: {
            show: false,
        },
        splitLine:{
            show:false
        }
    },
    series: [
        {
            name:'我也不知道这个数据是啥',
            type:'line',
            animationDuration:2500,
            data:[0, 0, 120, 675, 690, 720, 750,650,960,1140,1890,2040,3200,2310],
            smooth: true,
            itemStyle:{
                normal:{
                    borderColor:'white',
                    borderWidth:4
                }
            },
            lineStyle:{
                normal:{
                    color:'white',
                    width:1
                }
            },
            areaStyle:{
                normal:{
                    color:'#46566C'
                }
            },
            markPoint: {
                data: [
                    {name: '0', value: 0, xAxis: 0, yAxis: 0},
                    {name: '1', value: 675, xAxis: 3, yAxis: 675},
                    {name: '2', value: 3200, xAxis: 12, yAxis: 3200}
                ],
            },
        }
    ]
};
var myChart2 = echarts.init(document.getElementById('main2'));
var option2 = {
    title: {
        text: 'echarts版本对比（单位:KB）',
        textStyle:{
            color:'#000'
        }
    },
    tooltip: {},
    xAxis: {
        data: ["echarts2","echarts3"],
        axisLine:{
            lineStyle:{
                color:'#000'
            }
        }
    },
    yAxis: {
        axisLine:{
            show:false
        },
        axisTick:{
            show:false
        },
        axisLabel: {
            show: false,
        },
        splitLine:{
            show:false
        }
    },
    series: {
        name: '大小',
        type: 'bar',//图表类型
        animationDuration:2500,
        data: [373, 172],
        label: {
            normal: {
                show: true,
                position: 'inside'
            }
        }
    }
};
var img=document.getElementsByTagName('img')
console.log(img)
img[4].className='yishang'
for(var i=1;i<8;i++){
    img[i].id=i;
    img[i].onmousemove=function(){
        func1(this.id)
    }
}
function func1(ss){
    for(var j=1;j<8;j++){
        if(ss==j){
            img[j].className='yishang'
        }else{
            img[j].className=''
        }
    }
}

